import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import UnoCSS from "unocss/vite";
import path from "path";
function _resolve(dir) {
  return path.resolve(__dirname, dir);
}

// https://vitejs.dev/config/
export default defineConfig(configEnv => {
  // 环境变量配置
  const env = loadEnv(configEnv.mode, process.cwd());
  console.log("======env>>>>====", env);
  return {
    // 打包配置
    build: { outDir: "dist-vue3" },
    plugins: [
      vue(),
      AutoImport({
        resolvers: [ElementPlusResolver()],
        imports: ["vue", "vue-router", "pinia"],
        dts: "types/auto-imports.d.ts", // js项目建议也加上,他会告诉我们文件用到的某个方法来自于那个包.
      }),
      Components({
        resolvers: [ElementPlusResolver()],
        dts: "types/components.d.ts", // js项目建议也加上,生成组件类型声明文件（可选）
      }),
      UnoCSS(),
    ],
    resolve: {
      alias: {
        "@": _resolve("src"),
      },
      extensions: [".js", ".json"], // 导入省略后缀
    },
    base: env.VITE_APP_API_BASE_URL || "/",
    css: {
      // 预处理器
      preprocessorOptions: {
        less: {
          javascrptEnabled: true,
          charset: false,
          additionalData: `@import "${_resolve("src/assets/css/common.less")}";`,
        },
      },
    },
    optimizeDeps: {
      include: ["element-plus"],
    },
    server: {
      host: true,
      port: env.VITE_PORT,
      hmr: {
        overlay: false,
      },
      proxy: {
        "/api": {
          target: env.VITE_APP_API_BASE_URL,
          changeOrigin: true,
          ws: false, // 需要websocket 开启
          rewrite: path => path.replace(/^\/api/, ""),
        },
      },
    },
  };
});
